<?php
$wall = $this->wall;

?>
<script type="text/javascript" >
	$(document).ready( function(){
	});
	function post(  ){
		
		var tmp = $("#newcomment").val(), name = "<?php echo $this->username ?>", avatar ="<?php echo $this->avatar ?>",
			add = "<tr><td valign='top' class='people' height=70px ><div ><img align ='left' style='margin: 5px 3px 0px 3px;' src='/images/avatar/"+avatar+"' height='50px'/></div><td><td class='comment' valign = top ><div  class = \"name\" > <a href=\"/"+name+"\" >"+ name+" </a></div><div class=\"content\" style=\" margin: 0px 15px 10px 5px;\" >"+tmp+"</div></td></tr>	";
		$("#listComment").append(add);
		var wall_id = <?php echo $this->wall_id ?>,
			user_id = <?php  echo $this->id ?>,
			url = "/<?php echo $this->username ?>/comment/save";
			$.ajax({
				url: url,
				type: 'POST',
				data: { wall_id : wall_id , user_id : user_id , content : tmp },
				success: function( data, status ){
					$("#newcomment").val("");
				},
				error: function( data, status ){
					alert( 'error' );
				},
				complete: function(data, status){
				}
			});	
			
		
	}
</script>
<style>
.topic{
	font-size: 12px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #084e96;
	line-height: 1.28;
	text-align: left;
	direction: ltr;
 	margin: 0px 15px 10px 5px;
}
.nameTopic{
	font-size: 0.67em;
	font-weight: bold;
	font-size: 11px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #333;
	line-height: 1.28;
	text-align: left;
	direction: ltr;
 	margin: 5px 15px 0px 5px;
}
.name{
	font-size: 0.6em;
	font-weight: bold;
	font-size: 11px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #333;
	line-height: 1.28;
	text-align: left;
	direction: ltr;
 	margin: 5px 15px 0px 5px;
}
.peopleTopic{
	background-image: url('/images/people.png'); background-size:100% ;
	background-repeat:no-repeat;
	
}

.people{
	background-image: url('/images/people1.png'); background-size:100%  ;
	background-repeat:no-repeat;
	
}
.commentTopic{
	background-image: url('/images/comment1.png'); background-size:100% 100%;
	opacity:0.6;
	width: 500px
}
.comment{
	background-image: url('/images/comment1.png'); background-size:100% 100%;
	opacity:0.6;
	width: 400px
}
.content{
	font-size: 10px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #084e96;
	line-height: 1.28;
	text-align: left;
	direction: ltr;
 	margin: 0px 15px 10px 5px;
}

.content{
	font-size: 10px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #084e96;
	line-height: 1.28;
	text-align: left;
	direction: ltr;

}
#newcommment {
	font-size: 12px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: #084e96;
	text-align: left;
 	margin: 0px 15px 10px 5px;


	height: auto;
	background: #FFFFFF;
	text-align: left;
}
</style>

<table id="topic"  cellpadding="0" >
<tr >
	<td valign="top" height=80px class="peopleTopic" ><div ><img align = "left" style="margin: 8px 5px 0px 5px;" src="/images/avatar/<?php echo $wall['avatar']?>" height="60px"/></div><td>
	<td valign = top class="commentTopic" ><div  class = "nameTopic" > <a href="/<?php echo $this->username ?>" ><?php echo $wall['fullname']?> </a></div><div class="topic"><?php if( $wall[ 'type' ] == 1 ) echo $wall['content']; else echo "<img style='width: 100%' src='".$wall['photo']."' >"?></div></td>
</tr>
</table>

<div  style="margin-left: 100px; " >

<table border = 0 cellpadding='0' id="listComment" >
	<?php 
	$i=0;
	foreach( $this->comment as $list ){
		$id='comment'+ $i;
		echo "
			
				<tr>
						<td valign='top' class='people' height=70px ><div ><img align ='left' style='margin: 5px 3px 0px 3px;' src='/images/avatar/".$list['avatar']."' height='50px'/></div><td>
						<td class='comment' valign = top ><div  class = \"name\" > <a href='/".$this->userList[$list['user_id']]."' >".$list['fullname']." </a>
							</div><div class=\"content\" style=\" margin: 0px 15px 10px 5px;\" >".$list['content']."</div></td>
				</tr>
			
		";
	}
	?>
	</table>
	
	
	<table   cellpadding="0" >
	<tr >
		<td valign="top" height=70px class="people" ><div ><img align = "left" style="margin: 5px 3px 0px 3px;" src="/images/avatar/<?php echo $this->avatar ?>" height="50px"/></div><td>
		<td valign = top class="comment" ><div  class = "name" > <a href="/<?php echo $this->username;?>" ><?php echo $this->fullname ?> </a></div><div class="newcontent"><textarea rows= 2 cols= 30 id="newcomment"></textarea></div>
			<input value ="post" type = "button" onclick="post( );"/>
		</td>
	</tr>
	</table>
	
</div>